//职员管理

import React, {Component} from 'react';
import app from '../app';
import {
    Form,
    Input,
    Button,
    Table,
    Modal,
    Row,
    Col,
    Upload,
    Icon,
    DatePicker,
    Select,
    TreeSelect,
    Checkbox,
    Radio
} from 'antd';
import {project, employee, type, goods, sku, supplier, template} from '../value';
import '../css/other.css';
import moment from 'moment';
import {config} from "../config";
import {SettingPrices} from '../components/operateManage';
import {PictureUpload} from "../components/pictureUpload";
import {EditorState, convertToRaw, ContentState} from 'draft-js';
import {Editor} from 'react-draft-wysiwyg';
import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';
import draftToHtml from 'draftjs-to-html';
import htmlToDraft from 'html-to-draftjs';


const FormItem = Form.Item;
const confirm = Modal.confirm;
const RangePicker = DatePicker.RangePicker;
const Option = Select.Option;
const TextArea = Input.TextArea;
const SHOW_PARENT = TreeSelect.SHOW_PARENT;
const RadioGroup = Radio.Group;

const loop = (type, data) => {
    let typeList = [];
    data.map((item, index) => {
        if (type.type_id === item.type_parentId) {
            item.label = item.type_name;
            item.value = item.type_id;
            item.key = item.type_id;
            typeList.push(item);
            type.children = typeList;
            loop(item, data);
        } else {

        }
    })
};

const loopType = (type, data) => {
    let typeList = [];
    data.map((item, index) => {
        if (type.type_id === item.type_parentId) {
            item.label = item.type_name;
            item.value = item.type_id;
            item.key = item.type_id;
            typeList.push(item);
            type.children = typeList;
            loopType(item, data);
        } else {

        }
    })
};
const sum = (() => {
    return function getList(data, index, currentData) {
        if (index + 1 >= data.length) {
            for (let i = 0; i < currentData.length; i++) {
                currentData[i].name = data[index].name;
                currentData[i].valueData = [];
                currentData[i].inputData = [
                    {
                        value: ''
                    },
                    {
                        value: ''
                    },
                    {
                        value: ''
                    },
                    {
                        value: ''
                    },
                    {
                        value: ''
                    }
                ];
            }
        } else {
            let valueData = data[index + 1].valueData;
            for (let i = 0; i < currentData.length; i++) {
                currentData[i].name = data[index].name;
                currentData[i].inputData = null;
                currentData[i].valueData = getList(data, index + 1, JSON.parse(JSON.stringify(valueData)));
            }
        }
        return currentData;
    };
})();

/**
 * 深拷贝函数
 */
const deepClone = (obj) => {
    let objClone = obj instanceof Array ? [] : {};
    if (obj && typeof obj === 'object') {
        for (let key in obj) {
            if (obj.hasOwnProperty(key)) {
                //判断obj子元素是否为对象，如果是，递归复制
                if (obj[key] && typeof obj[key] === 'object') {
                    objClone[key] = deepClone(obj[key]);
                } else {
                    objClone[key] = obj[key];
                }
            }
        }
    }
    return objClone;
};

class GoodsAdd extends Component {
    constructor(props) {
        super(props);
        this.state = {
            goodList: [],
            goods_showStock: false,
            allNumber: 0,
            imgUrl: '',
            pictureList: [],
            pictureList1: [],
            shopType: [],  //商家的所有分类
            selectShopType: [],
            searchShopType: [],
            tableList: [],
            editorState: EditorState.createEmpty(),
            finalEditor: '',
            show: 2,
            more: false,
            skuData: [
                // {
                //     id: '02',
                //     name: '尺寸',
                //     isAdd: false,
                //     valueData: [
                //         {
                //             id: '0201',
                //             value: '大'
                //         },
                //         {
                //             id: '0202',
                //             value: '小'
                //         }
                //     ]
                // },
                // {
                //     id: '03',
                //     name: '味道',
                //     isAdd: false,
                //     valueData: [
                //         {
                //             id: '0301',
                //             value: '辣'
                //         }
                //     ]
                // }
            ],
            skuList: [],
            supplierList: [],
            data: [
                {
                    id: '001',
                    order_number: '1',
                    name: '盼盼',
                    img: '1.png',
                    price: '13',
                    num: '32',
                    state: '1'

                },
                {
                    id: '002',
                    order_number: '1',
                    name: '盼盼',
                    img: '1.png',
                    price: '13',
                    num: '32',
                    state: '1'
                }
            ],
            currentGoodsList: [],
            allGoodsList: [],
            visible: false,
            valueData: [],
            goods_isUniform: '1',
            templateList: [],
            template_id: '',
            goods_isable: '1',
            goods_onTime: '2019-10-12',
            goods_isAdvanceSale: true,
            goods_advance: true,
            goods_advanceSend: '1',
            goods_advanceTime: "2019-10-12",
            goods_advanceDay: '',
            goods_isLimit: true,
            goods_limitCount: '',
            allLoading: false,
            btnLoading:false
        }
    }

    formItemLayout = {
        labelCol: {span: 2},
        wrapperCol: {span: 12},
    };
    formItemLayout1 = {
        labelCol: {span: 8},
        wrapperCol: {span: 12},
    };
    formItemLayout2 = {
        labelCol: {span: 3},
        wrapperCol: {span: 12},
    };
    columns = [
        {
            title: '商品编号',
            dataIndex: 'goods_code'
        },
        {
            title: '商品名',
            dataIndex: 'goods_name'
        },
        {
            title: '图片',
            dataIndex: 'file_path',
            render: file_path => {
                return (
                    <img className={"projectImg"} src={config.imgServerUrl + file_path}/>
                )
            }
        },
        {
            title: '操作',
            dataIndex: this.columns,
            render: data => {
                return (
                    <Button style={{marginLeft: '10px'}} type="danger"
                            onClick={() => this.handleDeleteGood1(data.goods_code)}>取消推荐</Button>
                )
            }
        },
    ];

    columns1 = [
        {
            title: '商品编号',
            dataIndex: 'goods_code'
        },
        {
            title: '商品名',
            dataIndex: 'goods_name'
        },
        {
            title: '图片',
            dataIndex: 'file_path',
            render: file_path => {
                return (
                    <img className={"projectImg"} src={config.imgServerUrl + file_path}/>
                )
            }
        },
        {
            title: '类别',
            dataIndex: 'goods_type'
        },
        {
            title: '售价',
            dataIndex: 'goods_price'
        },
        {
            title: '状态',
            dataIndex: 'state',
            render: state => {
                let text = '';
                let color = '';
                if (state === '1') {
                    text = '已选';
                    color = 'red';
                } else if (state === '2') {
                    text = '可选';
                    color = 'black';
                }
                return (
                    <span style={{color: color}}>{text}</span>
                )
            }
        },
        {
            title: '操作',
            dataIndex: this.columns1,
            render: data => {
                return (
                    <span>
                    {
                        data.state === '1' ?
                            <Button type="danger"
                                    onClick={() => this.handleDeleteGood(data.goods_code)}>取消推荐</Button> :
                            <Button type="primary"
                                    onClick={() => this.handleChooseGood(data.goods_code)}>设为推荐</Button>
                    }
                    </span>
                )
            }
        },
    ];

    render() {
        const {getFieldDecorator} = this.props.form;
        const {
            allNumber,
            skuData,
            editorState,
            skuList,
            goods_showStock,
            goods_isUniform,
            goods_postagePrice,
            templateList,
            template_id,
            goods_isable,
            goods_onTime,
            goods_isAdvanceSale,
            goods_advance,
            goods_advanceSend,
            goods_advanceTime,
            goods_advanceDay,
            goods_isLimit,
            goods_limitCount,
            btnLoading
        } = this.state;
        console.log(goods_onTime);
        return (
            <div style={{paddingBottom: 25}}>
                <div className="pageTitle">
                    添加商品
                </div>
                <div className={'typeHeader'}>
                    基础信息
                </div>
                <Row style={{marginTop: 20}}>
                    <FormItem label={"商品编号"} style={{display: 'flex'}} {...this.formItemLayout}>
                        {getFieldDecorator('goods_code', {
                            rules: [{required: true, message: '请输入商品编号'}],
                        })(
                            <Input
                                placeholder="请输入商品编号" style={{width: '300px'}}/>
                        )}
                    </FormItem>
                    <FormItem label={"商品名称"} style={{display: 'flex'}} {...this.formItemLayout}>
                        {getFieldDecorator('goods_name', {
                            rules: [{required: true, message: '请输入商品名称'}],
                        })(
                            <Input
                                placeholder="请输入商品名称" style={{width: '300px'}}/>
                        )}
                    </FormItem>
                    <FormItem label={"关键词"} style={{display: 'flex'}} {...this.formItemLayout}>
                        {getFieldDecorator('goods_share')(
                            <div>
                                <TextArea
                                    placeholder="请输入关键词" style={{width: '300px'}}/>
                                <div style={{color: '#999'}}>微信分享给好友时会显示，建议36个字以内
                                    {/*<span style={{color: '#3388ff', marginLeft: 3, cursor: 'pointer'}}>查看示例</span>*/}
                                </div>
                            </div>
                        )}
                    </FormItem>
                    <FormItem label={"商品图"} style={{display: 'flex'}} {...this.formItemLayout}>
                        {getFieldDecorator('img2')(
                            <PictureUpload pictureList={this.state.pictureList} len={15}
                                           pictureList1={this.state.pictureList1}
                                           getPictureList={(data, data1) => this.handleGetIntelligenceList(data, data1)}></PictureUpload>
                        )}
                    </FormItem>
                    <FormItem label={"分类"} {...this.formItemLayout}>
                        {getFieldDecorator('shopTypes')(
                            <div>
                                <TreeSelect
                                    treeData={this.state.shopType}
                                    treeCheckable={true}
                                    multiple={true}
                                    onSelect={this.getShopType}
                                    showCheckedStrategy={SHOW_PARENT}
                                    searchPlaceholder='请选择'
                                    style={{width: 300}}
                                />
                                <Button type={'primary'} style={{marginLeft: 5}}>添加分类</Button>
                            </div>
                        )}
                    </FormItem>
                    <FormItem label={"是否是首页推荐商品"} {...this.formItemLayout2}>
                        {getFieldDecorator('goods_nominate')(
                            <Checkbox/>
                        )}
                    </FormItem>
                    <Row>
                        <Col offset={2}>
                            <Button type={'primary'} onClick={() => this.handleShowMore()}>更多信息</Button>
                        </Col>
                    </Row>
                    {
                        this.state.more ?
                            <Row>
                                <Col offset={2}>
                                    <div style={{display: 'flex', marginTop: 20, width: 260, float: 'left'}}>
                                        <FormItem label={"品牌"} style={{display: 'flex'}} {...this.formItemLayout1}>
                                            {getFieldDecorator('goods_brand')(
                                                <Input style={{width: 180}}>
                                                </Input>
                                            )}
                                        </FormItem>
                                    </div>
                                    <div style={{display: 'flex', marginTop: 20, width: 260, float: 'left'}}>
                                        <FormItem label={"商品标签"} style={{display: 'flex'}} {...this.formItemLayout1}>
                                            {getFieldDecorator('goods_label')(
                                                <Input style={{width: 180}}>
                                                </Input>
                                            )}
                                        </FormItem>
                                    </div>
                                    <div style={{display: 'flex', marginTop: 20, width: 260, float: 'left'}}>
                                        <FormItem label={"供应商"} style={{display: 'flex'}} {...this.formItemLayout1}>
                                            {getFieldDecorator('supplier_id')(
                                                <Select style={{width: 180}}>
                                                    {
                                                        this.state.supplierList.map((item, index) => {
                                                            return (
                                                                <Option value={item.supplier_id}
                                                                        key={index}>{item.supplier_name}</Option>
                                                            )
                                                        })
                                                    }
                                                </Select>
                                            )}
                                        </FormItem>
                                    </div>
                                    <div style={{display: 'flex', marginTop: 20, width: 260, float: 'left'}}>
                                        <FormItem label={"是否进出口"} style={{display: 'flex'}} {...this.formItemLayout1}>
                                            {getFieldDecorator('goods_imported')(
                                                <Select style={{width: 180}}>
                                                    <Option value={'1'}>是</Option>
                                                    <Option value={'2'}>否</Option>
                                                </Select>
                                            )}
                                        </FormItem>
                                    </div>
                                    <div style={{display: 'flex', marginTop: 20, width: 260, float: 'left'}}>
                                        <FormItem label={"单位"} style={{display: 'flex'}} {...this.formItemLayout1}>
                                            {getFieldDecorator('goods_unit')(
                                                <Input style={{width: 180}}>
                                                </Input>
                                            )}
                                        </FormItem>
                                    </div>
                                    <div style={{display: 'flex', marginTop: 20, width: 260, float: 'left'}}>
                                        <FormItem label={"产地"} style={{display: 'flex'}} {...this.formItemLayout1}>
                                            {getFieldDecorator('goods_origin')(
                                                <Input style={{width: 180}}>
                                                </Input>
                                            )}
                                        </FormItem>
                                    </div>
                                    <div style={{display: 'flex', marginTop: 20, width: 260, float: 'left'}}>
                                        <FormItem label={"规格"} style={{display: 'flex'}} {...this.formItemLayout1}>
                                            {getFieldDecorator('goods_spec')(
                                                <Input style={{width: 180}}>
                                                </Input>
                                            )}
                                        </FormItem>
                                    </div>
                                    <div style={{display: 'flex', marginTop: 20, width: 260, float: 'left'}}>
                                        <FormItem label={"保质期"} style={{display: 'flex'}} {...this.formItemLayout1}>
                                            {getFieldDecorator('goods_quality')(
                                                <DatePicker style={{width: 180}}>
                                                </DatePicker>
                                            )}
                                        </FormItem>
                                    </div>
                                </Col>
                            </Row> : ''
                    }
                </Row>
                <div className={'typeHeader'}>
                    库存价格
                </div>
                {
                    this.state.show === 1 ?
                        <Row>
                            <Row style={{display: 'flex', marginTop: 20}}>
                                <div style={{width: 90, paddingLeft: 20}}>商品规格：</div>
                                <div className={'skuContainer'}>
                                    {
                                        skuData.map((item, index) => {
                                            return (
                                                <span key={index}>
                                        <div className={'skuContainerHeader'}>
                                            <span>规格名：</span>
                                            <Select style={{width: 150, marginLeft: 10}} value={item.id}
                                                    onChange={(e) => this.handleChooseSku(e, index)}>
                                                {
                                                    skuList.map((itemName, indexName) => {
                                                        return (
                                                            <Option key={indexName} disabled={itemName.isAdd}
                                                                    value={itemName.sku_property_id}>{itemName.sku_property_name}</Option>
                                                        )
                                                    })
                                                }
                                            </Select>
                                            <div style={{
                                                position: 'absolute',
                                                right: '20px',
                                                top: '0px',
                                                color: '#999'
                                            }}
                                                 onClick={() => this.handleDeleteSku(index)}
                                            >
                                                <Icon type="close-circle"/>
                                            </div>
                                        </div>
                                        <div style={{display: 'flex', padding: '20px 20px 10px 20px'}}>
                                            <span style={{paddingTop: 5}}>规格值：</span>
                                            <div className={'skuValueContainer'}>
                                                {
                                                    item.valueData.map((item1, index1) => {
                                                        return (
                                                            <Input disabled={true} value={item1.value} key={index1}
                                                                   onChange={(e) => this.handleSkuValueChange(e)}/>
                                                        )
                                                    })
                                                }
                                                {
                                                    item.isAdd ?
                                                        <div className={'addValueInput'}>
                                                            <FormItem style={{
                                                                display: 'flex',
                                                                marginBottom: 0
                                                            }} {...this.formItemLayout1}>
                                                                {getFieldDecorator('skuValue' + index, {
                                                                    rules: [{required: true, message: '请输入规格值'}],
                                                                })(
                                                                    <div>
                                                                        <Input placeholder={'回车添加'}
                                                                               onPressEnter={(e) => this.handlePressEnter(e, index)}
                                                                               style={{height: 28}}/>
                                                                    </div>
                                                                )}
                                                            </FormItem>
                                                        </div> : ''
                                                }
                                                <div style={{}} className={'addValueText'}
                                                     onClick={() => this.handleShowAdd(index)}>添加规格值</div>
                                            </div>
                                        </div>
                                    </span>
                                            )
                                        })
                                    }
                                    <div className={'skuContainerHeader'}>
                                        <Button onClick={() => this.handleAddSku()}>添加规格项目</Button>
                                    </div>
                                </div>
                            </Row>
                            <Row style={{display: 'flex', marginTop: 20}}>
                                <div style={{width: 90, paddingLeft: 20}}>规格明细：</div>
                                <div className={'skuContainer'}>
                                    <Row className={'tableHeaderContainer'}>
                                        {
                                            this.getTableHeader(this.state.skuData, 0)
                                        }
                                    </Row>
                                    <Row className={'tableBodyContainer'}>
                                        {
                                            this.getAll(this.state.tableList)
                                        }
                                    </Row>
                                    <Row style={{height: 30, paddingTop: 10}}>
                                        批量设置：
                                        <SettingPrices data={this.state.tableList} type={1}
                                                       handleGetNum={(num, type) => this.handleGetNum(num, type)}></SettingPrices>
                                        <SettingPrices data={this.state.tableList} type={2}
                                                       handleGetNum={(num, type) => this.handleGetNum(num, type)}></SettingPrices>
                                    </Row>
                                </div>
                            </Row>
                            <Row style={{display: 'flex', marginTop: 20}}>
                                <div style={{width: 90, paddingLeft: 20}}></div>
                                <div>
                                    <Checkbox checked={goods_showStock}
                                              onChange={(e) => this.handleGoodsShowStock(e)}>商品详情显示剩余件数</Checkbox>
                                </div>
                            </Row>
                            <Row style={{display: 'flex', marginTop: 20}}>
                                <div style={{width: 90, paddingLeft: 20}}></div>
                                <div>
                                    <Button onClick={() => this.handleChooseStockType(2)}>取消规格项目</Button>
                                </div>
                            </Row>
                        </Row> : ''
                }
                {
                    this.state.show === 2 ?
                        <Row style={{marginTop: 20}}>
                            <FormItem label={"价格"} style={{display: 'flex'}} {...this.formItemLayout}>
                                {getFieldDecorator('goods_price', {
                                    rules: [{required: true, message: '请输入价格'}],
                                })(
                                    <Input addonBefore="￥"
                                           placeholder="请输入价格" style={{width: '300px'}}/>
                                )}
                            </FormItem>
                            <FormItem label={"成本"} style={{display: 'flex'}} {...this.formItemLayout}>
                                {getFieldDecorator('goods_cost', {
                                    rules: [{required: true, message: '请输入成本'}],
                                })(
                                    <Input addonBefore="￥"
                                           placeholder="请输入成本" style={{width: '300px'}}/>
                                )}
                            </FormItem>
                            <FormItem label={"划线价"} style={{display: 'flex'}} {...this.formItemLayout}>
                                {getFieldDecorator('goods_markingPrice')(
                                    <div>
                                        <Input
                                            placeholder="请输入划线价" style={{width: '300px'}}/>
                                        <div style={{color: '#999'}}>商品没有优惠的情况下，划线价在商品详情会已以划线形式显示。
                                            {/*<span style={{color: '#3388ff', marginLeft: 3, cursor: 'pointer'}}>示例</span>*/}
                                        </div>
                                    </div>
                                )}
                            </FormItem>
                            <FormItem label={"库存"} style={{display: 'flex'}} {...this.formItemLayout}>
                                {getFieldDecorator('goods_stock', {
                                    rules: [{required: true, message: '请输入库存'}],
                                })(
                                    <div>
                                        <Input
                                            placeholder="请输入库存" style={{width: '300px'}}/>
                                        <div>
                                            <Checkbox checked={goods_showStock}
                                                      onChange={(e) => this.handleGoodsShowStock(e)}>商品详情显示剩余件数</Checkbox>
                                        </div>
                                        <div style={{color: '#999'}}>
                                            库存为0时，会放到『已售罄』的商品列表里，保存后买家看到的商品可售库存同步更新
                                        </div>
                                    </div>
                                )}
                            </FormItem>
                            <Row>
                                <Col span={10} offset={2}>
                                    <Button onClick={() => this.handleChooseStockType(1)}>添加规格项目</Button>
                                </Col>
                            </Row>
                        </Row> : ''
                }
                <div className={'typeHeader'}>
                    其它信息
                </div>
                <Row style={{display: 'flex', marginTop: 20}}>
                    <div style={{width: '95px', paddingRight: 10, textAlign: 'right'}}><span
                        style={{color: 'red', fontWeight: 'bold', fontSize: '16px'}}>*</span>快递运费：
                    </div>
                    <div>
                        <RadioGroup onChange={(e) => this.handleGoodsIsUniform(e)} value={goods_isUniform}
                                    style={{padding: 0, margin: 0}}>
                            <Radio style={{display: 'block', height: '28px', lineHeight: '28px'}} value={'1'}>
                                统一邮费<Input addonBefore="￥" style={{width: '160px', marginLeft: '10px'}}
                                           value={goods_postagePrice}
                                           onChange={(e) => this.handleGoodsPostagePrice(e)}
                                           type={'number'}
                            />
                            </Radio>
                            <Radio style={{display: 'block', height: '28px', lineHeight: '28px', marginTop: '20px'}}
                                   value={'2'}>
                                运费模板
                                <Select style={{width: '160px', marginLeft: '10px'}} value={template_id}
                                        onChange={(e) => this.handleChooseTemplate(e)}>
                                    {
                                        templateList.map((item, index) => {
                                            return (
                                                <Option value={item.template_id}
                                                        key={index}>{item.template_name}</Option>
                                            )
                                        })
                                    }
                                </Select>
                                {/*<span style={{*/}
                                    {/*color: '#3388ff',*/}
                                    {/*marginLeft: 8,*/}
                                    {/*cursor: 'pointer',*/}
                                    {/*marginRight: '3px'*/}
                                {/*}} onClick={() => this.handleGetTemplateList({page: 1, size: 100})}>刷新</span>|*/}
                                {/*<span className={'pointerSpanStyle'}>新建</span>|*/}
                                {/*<span className={'pointerSpanStyle'}>如何设置合适的运费模板</span>*/}
                            </Radio>
                        </RadioGroup>
                        <div style={{color: '#999', marginTop: '3px'}}>
                            运费模板支持按地区设置运费，按购买件数计算运费，按重量设计运费等
                        </div>
                    </div>
                </Row>
                <Row style={{display: 'flex', marginTop: 20}}>
                    <div style={{width: '95px', paddingRight: 10, textAlign: 'right', paddingTop: '4px'}}>上架时间：</div>
                    <div>
                        <RadioGroup onChange={(e) => this.handleGoodsIsable(e)} value={goods_isable}
                                    style={{padding: 0, margin: 0}}>
                            <Radio style={{display: 'block', height: '28px', lineHeight: '28px'}} value={'1'}>
                                立即上架售卖
                            </Radio>
                            <Radio className={'radioLineHeight'} style={{display: 'block'}} value={'2'}>
                                自定义上架时间
                                <DatePicker value={moment(goods_onTime)}
                                            style={{width: '160px', marginLeft: '10px'}}
                                            onChange={(e) => this.handleIsableTimeChange(e)}/>
                            </Radio>
                            <Radio className={'radioLineHeight'} style={{display: 'block'}} value={'0'}>
                                暂不售卖，放入仓库
                            </Radio>
                        </RadioGroup>
                    </div>
                </Row>
                <div className={'typeHeader'}>
                    更多设置
                </div>
                <Row style={{display: 'flex', marginTop: 20}}>
                    <div style={{width: '95px', paddingRight: 10, textAlign: 'right', paddingTop: '4px'}}>预售：</div>
                    <div>
                        <div className={'lineHeightStyle'}>
                            <Checkbox checked={goods_isAdvanceSale} onChange={(e) => this.handleGoodsIsAdvanceSale(e)}/><span
                            style={{marginLeft: '1px'}}>无现货，下单后需要过段时间才能发货</span>
                        </div>
                        <div className={'lineHeightStyle'}>
                            <Radio checked={goods_advance}/>全款预售
                        </div>
                        <div className={'readySellContainer'}>
                            <RadioGroup onChange={(e) => this.handleGoodsAdvanceSend(e)} value={goods_advanceSend}
                                        style={{padding: 0, margin: 0}}>
                                <Radio className={'radioLineHeight'} style={{display: 'block'}} value={'1'}>
                                    <DatePicker
                                        value={moment(goods_advanceTime)}
                                        format={'YYYY-MM-DD'}
                                        style={{width: '160px', marginLeft: '1px'}}
                                        onChange={(e) => this.handleGoodsAdvanceTime(e)}
                                        placeholder={'请选择发货时间'}/><span className={'sendTimeSpan'}>开始发货</span>
                                </Radio>
                                <Radio className={'radioLineHeight'} style={{display: 'block'}} value={'2'}>
                                    付款成功<Input className={'sendTimeSpan'}
                                               style={{width: '60px'}}
                                               value={goods_advanceDay}
                                               onChange={(e) => this.handleGoodsAdvanceDay(e)}
                                               type={'number'}/>
                                    <span className={'sendTimeSpan'}>天后发货</span>
                                </Radio>
                            </RadioGroup>
                            <div style={{color: '#999', marginTop: '3px'}}>
                                只允许设置90天内的发货时间，请务必按照约定时间发货以避免引起客户投诉。{/*<span className={'pointerSpanStyle'}>什么是预售？</span>*/}
                            </div>
                        </div>
                    </div>
                </Row>
                <Row style={{display: 'flex', marginTop: 30}}>
                    <div style={{width: '95px', paddingRight: 10, textAlign: 'right', paddingTop: '4px'}}>限购：</div>
                    <div>
                        <div className={'lineHeightStyle'}>
                            <Checkbox checked={goods_isLimit} onChange={(e) => this.handleGoodsIsLimit(e)}/><span
                            style={{marginLeft: '1px'}}>限制每人可购买数量</span>
                        </div>
                        <div>
                            每个买家账号累计限购<Input
                            className={'sendTimeSpan'}
                            style={{width: '60px'}}
                            value={goods_limitCount}
                            onChange={(e) => this.handleGoodsLimitCount(e)}
                            type={'number'}/>
                            <span className={'sendTimeSpan'}>件</span>
                        </div>
                    </div>
                </Row>
                <Row style={{marginTop: 30}}>
                    <Col span={12}>
                        <Editor
                            editorState={editorState}
                            toolbarClassName="toolbarClassName1"
                            wrapperClassName="wrapperClassName1"
                            editorClassName="editorClassName1"
                            localization={{
                                locale: 'zh',
                            }}
                            toolbar={{
                                image: {
                                    uploadCallback: this.uploadImageCallBack,
                                    defaultSize: {
                                        height: 'auto',
                                        width: '100%',
                                    }
                                }
                            }}
                            onEditorStateChange={this.onEditorStateChange}
                        />
                    </Col>
                    <Col offset={1} span={11}>

                        <div className={'detailContainer'} dangerouslySetInnerHTML={{__html: this.state.finalEditor}}>

                        </div>
                    </Col>
                </Row>
                {
                    this.handleGetModal()
                }
                <Row style={{marginTop: '20px'}}>
                    <Table
                        columns={this.columns}
                        rowKey={(record, index) => index}
                        dataSource={this.state.currentGoodsList}
                        pagination={false}
                    />
                </Row>
                <Row style={{textAlign: 'center', marginTop: 20}}>
                    <Col span={8} offset={6}>
                        <Button loading={btnLoading} type={'primary'} onClick={(e) => this.handleSubmit(e)}>保存</Button>
                    </Col>
                </Row>
            </div>
        )
    }

    /**
     * 初始化
     */
    componentDidMount() {
        const param = {page: 1, size: 100};
        this.handleSearchSkuList(param);
        const param1 = {
            page: 1,
            size: 100,
            ableSearch: '1'
        };
        this.handleSearchSupplierList(param1);
        //this.requestShopType();
        this.getData();
        this.requestShopType();

        /***
         * 获取运费模板
         */
        this.handleGetTemplateList({page: 1, size: 100});
    }


    /**
     * 是否统一邮费
     * @param e
     */
    handleGoodsIsUniform(e) {
        this.setState({goods_isUniform: e.target.value});
    }

    /**
     * 统一邮费输入框
     * @param e
     */
    handleGoodsPostagePrice(e) {
        this.setState({goods_postagePrice: e.target.value});
    }

    /**
     * 获取运费模板
     * @param param
     */
    handleGetTemplateList(param) {
        const _this = this;
        app.post(template.SEARCH_TEMPLATE_LIST, param).then(res => {
            if (res.code === 1) {
                _this.setState({templateList: res.data});
            } else {
                app.alert(res.msg, 'info', 1);
            }
        })
    }

    /**
     * 选择运费模板
     * @param e
     */
    handleChooseTemplate(e) {
        this.setState({template_id: e});
    }

    /**
     * 是否显示剩余件数
     * @param e
     */
    handleGoodsShowStock(e) {
        this.setState({goods_showStock: e.target.checked});
    }

    /**
     * 处理上架时间
     * @param e
     */
    handleGoodsIsable(e) {
        this.setState({goods_isable: e.target.value});
    }

    /**
     * 获取上架时间
     * @param e
     */
    handleIsableTimeChange(e) {
        if (!e) {
            this.setState({goods_onTime: '1970-01-01'});
        } else {
            this.setState({goods_onTime: e._d});
        }
    }

    /**
     * 是否预售
     * @param e
     */
    handleGoodsIsAdvanceSale(e) {
        this.setState({goods_isAdvanceSale: e.target.checked, goods_advance: e.target.checked});
    }

    /**
     * 设置发货时间
     * @param e
     */
    handleGoodsAdvanceSend(e) {
        this.setState({goods_advanceSend: e.target.value});
    }

    /**
     * 获取具体发货时间
     * @param e
     */
    handleGoodsAdvanceTime(e) {
        if (!e) {
            this.setState({goods_advanceTime: '1970-01-01'});
        } else {
            this.setState({goods_advanceTime: e._d});
        }
    }

    /**
     * 获取发货天数
     * @param e
     */
    handleGoodsAdvanceDay(e) {
        this.setState({goods_advanceDay: e.target.value});
    }

    /**
     * 是否限制商家购买数量
     * @param e
     */
    handleGoodsIsLimit(e) {
        this.setState({goods_isLimit: e.target.checked});
    }

    /**
     * 获取限购件数
     * @param e
     */
    handleGoodsLimitCount(e) {
        this.setState({goods_limitCount: e.target.value});
    }

    /**
     * 选择规格
     * @param e
     * @param index
     */
    handleChooseSku(e, index) {
        const _this = this;
        this.handleDealWithSku(e, index).then((res) => {
            if (res.code === 1) {
                const skuData = res.data;
                const {skuList} = _this.state;
                for (let i = 0; i < skuList.length; i++) {
                    skuList[i].isAdd = false;
                    for (let j = 0; j < skuData.length; j++) {
                        if (skuList[i].sku_property_id === skuData[j].id) {
                            skuList[i].isAdd = true;
                            break;
                        }
                    }
                }
                _this.setState({skuList, skuData});
                _this.getData();
            } else {
                app.alert(res.msg, 'info', 1);
            }
        })
    }


    handleDealWithSku(e, index) {
        const _this = this;
        return new Promise((resolve, reject) => {
            let {skuList, skuData} = _this.state;
            for (let i = 0; i < skuList.length; i++) {
                if (skuList[i].sku_property_id === e) {
                    let item = {
                        id: e,
                        name: skuList[i].sku_property_name,
                        isAdd: false
                    };
                    app.post(sku.SEARCH_SKU_ONE, {sku_property_id: e}).then((res) => {
                        if (res.code === 1) {
                            let recordList = res.data.recordList;
                            let valueData = [];
                            if (recordList) {
                                for (let j = 0; j < recordList.length; j++) {
                                    let item1 = {
                                        id: e + j,
                                        value: recordList[j].sku_record_name
                                    };
                                    valueData.push(item1);
                                }
                            }
                            item.valueData = valueData;
                            skuData[index] = item;
                            resolve({code: 1, data: skuData});
                        } else {
                            reject({code: 2, msg: res.msg});
                        }
                    })
                }
            }
        });
    }

    /**
     * 处理添加规格项目按钮事件
     */
    handleAddSku() {
        let {skuData} = this.state;
        let hasEdit = true;
        for (let i = 0; i < skuData.length; i++) {
            if (!skuData[i].id) {
                hasEdit = false
            }
        }
        if (!hasEdit) {
            app.alert('请先设置规格', 'info', 1);
            return;
        }
        let item = {
            id: '',
            name: '',
            isAdd: false,
            valueData: []
        };
        skuData.push(item);
        this.setState({skuData});
    }

    /**
     * 删除规格
     * @param index
     */
    handleDeleteSku(index) {
        let {skuData} = this.state;
        skuData.splice(index, 1);
        console.log(skuData);
        const {skuList} = this.state;
        for (let i = 0; i < skuList.length; i++) {
            skuList[i].isAdd = false;
            for (let j = 0; j < skuData.length; j++) {
                if (skuList[i].sku_property_id === skuData[j].id) {
                    skuList[i].isAdd = true;
                    break;
                }
            }
        }
        this.setState({skuList, skuData});
        this.getData();
    }

    /**
     * 处理规格值变化事件
     * @param e
     */
    handleSkuValueChange(e) {
        console.log(e);
    }

    /**
     * 递归格式化规格列表
     * @param data
     * @param index
     * @param currentData
     * @returns {*}
     */

    /**
     * 调用格式化规格方法
     */
    getData() {
        let skuData = this.state.skuData;
        if (skuData.length <= 0) {
            this.setState({tableList: []});
            return;
        }
        let data = sum(skuData, 0, skuData[0].valueData);
        this.setState({tableList: data});
    }

    /**
     * 递归显示表头
     * @param data
     * @param index
     * @returns {*}
     */
    getTableHeader = (data, index) => {
        if (index >= data.length) {
            return (
                <Col>
                    <Col span={4}>
                        <span style={{color: 'red', fontSize: '16px', fontWeight: 'bold'}}>*</span>价格(元)
                    </Col>
                    <Col span={4}>
                        <span style={{color: 'red', fontSize: '16px', fontWeight: 'bold'}}>*</span>划线价(元)
                    </Col>
                    <Col span={4}>
                        <span style={{color: 'red', fontSize: '16px', fontWeight: 'bold'}}>*</span>库存
                    </Col>
                    <Col span={4}>
                        条码
                    </Col>
                    <Col span={4}>
                        成本价
                    </Col>
                    <Col span={4}>
                        销量
                    </Col>
                </Col>
            )
        } else {
            return (
                <span>
                    <Col span={2 + index}>
                        {data[index].name}
                    </Col>
                    <Col span={24 - (2 + index)}>
                        {
                            this.getTableHeader(data, index + 1)
                        }
                    </Col>
                </span>
            )
        }
    };

    /**
     * 调用显示表格内容方法
     * @param data
     * @returns {*}
     */
    getAll(data) {
        return data.map((item, index) => {
            return (
                <Row className={'tableBodyContainerItem'} key={index}>
                    {
                        this.getTableBodyItem(item, 0, item.id, index, item.name)
                    }
                </Row>
            )
        })
    };

    /**
     * 递归显示表格内容
     * @param data
     * @param index
     * @param id
     * @returns {*}
     */
    getTableBodyItem(data, index, id, indexKey, name) {
        return (
            <span key={data.id}>
                <Col span={2 + index}>
                    {data.value}
                </Col>
                <Col span={24 - (2 + index)}>
                    {
                        data.valueData.length > 0 ?
                            <Row>
                                {
                                    data.valueData.map((item, index1) => {
                                        return this.getTableBodyItem(item, index + 1, id, indexKey + '-' + index1, name + item.name)
                                    })
                                }
                            </Row> :
                            <span>
                                {

                                    data.inputData ? <span>
                                {
                                    data.inputData.map((item, indexInput) => {
                                        return (
                                            <Col span={4} style={{padding: 0}} key={indexInput}>
                                                <Input value={item.value} style={{width: 60}} key={indexKey}
                                                       onChange={(e) => {
                                                           item.value = e.target.value;
                                                           this.handleInput(e, indexInput, indexKey)
                                                       }
                                                       }/>
                                            </Col>
                                        )
                                    })
                                }
                                        <Col span={4} style={{padding: 0}}>
                                    0
                                </Col>
                            </span> : ''
                                }
                            </span>
                    }
                </Col>
            </span>
        )
    };


    // 请求商家的所有分类
    requestShopType() {
        let msg = {};
        let temp;
        app.post(type.searchAllType, {token: app.getToken()}).then(req => {
            if (req.code == 1) {
                let firstMenu = [];
                req.data.map((item) => {
                    // 先查到最顶层数据
                    temp = {
                        label: item.type_name,
                        value: item.type_id,
                        type_id: item.type_id,
                        type_isable: item.type_isable,
                        type_level: item.type_level,
                        type_name: item.type_name,
                        type_parentId: item.type_parentId,
                        key: item.type_id
                    };
                    if (!item.type_parentId) {
                        firstMenu.push(temp);
                    }
                });
                firstMenu.map((item) => {
                    loop(item, req.data);  //根据最顶层的数据所含的子数据的ID和所有的分类ID比较，相同的则为他的子数据
                });
                this.setState({shopType: firstMenu});
            } else {
                // app.alert(req.msg, 'error', 3);
            }
        });
    }


    /**
     * 查找sku属性列表
     * @param param
     */
    handleSearchSkuList(param) {
        let _this = this;
        _this.setState({loading: true});
        app.post(sku.SEARCH_SKU_LIST, param).then(result => {
            if (result.code === 1) {
                const data = result.data;
                this.setState({skuList: data});
            } else {
                app.alert(result.msg, 'info', 1);
                this.setState({skuList: []});
            }
        });
    }

    /**
     * 批量设置价格库存
     * @param num
     * @param type
     */
    handleGetNum(num, type) {
        let {tableList} = this.state;
        let newTableList = this.handleSetAllSkuValue(tableList, num, type);
        this.setState({tableList: newTableList});
    }


    handleSetAllSkuValue(list, value, type) {
        list.map((item, index) => {
            if (Array.isArray(item.valueData) && item.valueData.length > 0) {
                this.handleSetAllSkuValue(item.valueData, value, type);
            } else {
                if (type === 1) {
                    item.inputData[0].value = value;
                } else {
                    item.inputData[2].value = value;
                }
            }
        });
        return list;
    }

    /**
     * 获取供应商列表
     * @param param
     */
    handleSearchSupplierList(param) {
        app.post(supplier.SEARCH_SUPPLIER_LIST, param).then(result => {
            if (result.code === 1) {
                const data = result.data;
                console.log(data);
                this.setState({supplierList: data});
            } else {
                app.alert(result.msg, 'info', 1);
                this.setState({supplierList: []});
            }
        });
    }

    /**
     * 处理选择商品事件
     * @param data
     */
    handleChoose(data) {
        for (let i = 0; i < data.length; i++) {
            data[i].order_number = i + 1;
        }
        this.setState({goodList: data, allNumber: data.length});
    }

    /**
     * 处理提交事件
     * @param e
     */
    handleSubmit(e) {
        e.preventDefault();
        let _this = this;
        let goods_isSpecPrice = '1', goods_isRecommend = '1';
        let {
            finalEditor,
            goods_isable,
            goods_onTime,
            show,
            goods_showStock,
            goods_isUniform,
            goods_postagePrice,
            template_id,
            goods_isAdvanceSale,
            goods_advance,
            goods_advanceSend,
            goods_advanceTime,
            goods_advanceDay,
            goods_isLimit,
            goods_limitCount,
            selectShopType,
            pictureList1,
            currentGoodsList,
            tableList
        } = this.state;
        if (!pictureList1 || pictureList1.length <= 0) {
            app.alert('请上传商品图片');
            return;
        }
        const fileList = pictureList1;
        if (!selectShopType || selectShopType.length <= 0) {
            app.alert('请选择商品分类');
            return;
        }
        const typeList = [];
        for (let i = 0; i < selectShopType.length; i++) {
            let item = {
                type_id: selectShopType[i].type_id,
                goods_type_name: selectShopType[i].type_name
            };
            typeList.push(item);
        }
        let skuList = [];
        if (show === 1) {
            goods_isSpecPrice = '1';
            if (!tableList || tableList.length <= 0) {
                app.alert('请选择规格项目', 'info', 1);
                return;
            }
            let skuListTemp = this.handleGetSkuValue();
            let hasValue = true;
            let errorText = '';
            for (let i = 0; i < skuListTemp.length; i++) {
                let value = skuListTemp[i].value;
                for (let j = 0; j < value.length; j++) {
                    if (j === 3) {
                        if (!value[j].value) {
                            hasValue = false;
                            errorText = '请设置完整的规格明细';
                            break;
                        }
                    } else {
                        if (isNaN(value[j].value)) {
                            hasValue = false;
                            errorText = '价格以及库存必须为数字类型';
                            break;
                        }
                        if (Number(value[j].value) < 0) {
                            hasValue = false;
                            errorText = '价格和库存不能为负数';
                            break;
                        }
                    }
                }
                if (!hasValue) {
                    break;
                }
            }
            if (!hasValue) {
                app.alert(errorText, 'info', 1);
                return;
            }
            for (let i = 0; i < skuListTemp.length; i++) {
                let value = skuListTemp[i].value;
                let item = {
                    goods_sku_property: skuListTemp[i].goods_sku_property,
                    goods_sku_record: skuListTemp[i].goods_sku_record,
                    goods_sku_price: value[0].value,
                    goods_sku_stock: value[2].value,
                    goods_sku_markingPrice: value[1].value,
                    goods_sku_barCode: value[3].value,
                    goods_sku_costPrice: value[4].value,
                };
                skuList.push(item);
            }
        } else {
            goods_isSpecPrice = '2';
        }
        if (!goods_showStock) {
            goods_showStock = '2';
        } else {
            goods_showStock = '1';
        }
        if (goods_isUniform === '1') {
            if (isNaN(goods_postagePrice)) {
                app.alert('邮费必须为数字类型', 'info', 1);
                return;
            }
            if (goods_postagePrice < 0) {
                app.alert('邮费不能为负数', 'info', 1);
                return;
            }
        } else {
            if (!template_id) {
                app.alert('请选择运费模板', 'info', 1);
                return;
            }
        }
        if (goods_isable === '2') {
            goods_isable = '1';
            if (!goods_onTime) {
                app.alert('请设置自定义上架时间', 'info', 1);
                return;
            }
            goods_onTime = moment(goods_onTime).format('YYYY-MM-DD');
        } else {
            goods_onTime = null;
        }
        if (!goods_isAdvanceSale) {
            goods_isAdvanceSale = '2';
            goods_advance = null;
        } else {
            goods_isAdvanceSale = '1';
            goods_advance = '1';
            if (goods_advanceSend === '1') {
                if (!goods_advanceTime) {
                    app.alert('请设置预售发货时间', 'info', 1);
                    return;
                }
                goods_advanceTime = moment(goods_advanceTime).format('YYYY-MM-DD');
            } else {
                if (!goods_advanceDay) {
                    app.alert('请设置付款后的发货天数', 'info', 1);
                    return;
                }
                if (isNaN(goods_advanceDay)) {
                    app.alert('付款后的发货天数必须为数字', 'info', 1);
                    return;
                }
                if (goods_advanceDay < 0) {
                    app.alert('付款后的发货天数不能为负数', 'info', 1);
                    return;
                }
            }
        }
        if (!goods_isLimit) {
            goods_isLimit = '2';
        } else {
            goods_isLimit = '1';
            if (!goods_limitCount) {
                app.alert('请设置限购件数', 'info', 1);
                return;
            }
            if (isNaN(goods_limitCount)) {
                app.alert('限购件数必须为数字', 'info', 1);
                return;
            }
            if (goods_limitCount < 0) {
                app.alert('限购不能为负数', 'info', 1);
                return;
            }
        }
        const goods_details = finalEditor;
        const recommendList = [];
        if (!currentGoodsList || currentGoodsList.length <= 0) {
            goods_isRecommend = '2';
        } else {
            goods_isRecommend = '1';
            for (let i = 0; i < currentGoodsList.length; i++) {
                let item = {
                    goods_recommend_targetId: currentGoodsList[i].goods_id
                };
                recommendList.push(item);
            }
        }
        this.props.form.validateFields((err, values) => {
            if (!err) {
                if (!values.goods_nominate) {
                    values.goods_nominate = '2';
                } else {
                    values.goods_nominate = '1';
                }
                values.goods_isable = goods_isable;
                values.goods_onTime = goods_onTime;
                values.goods_isSpecPrice = goods_isSpecPrice;
                values.goods_showStock = goods_showStock;
                values.goods_isUniform = goods_isUniform;
                values.goods_postagePrice = goods_postagePrice;
                values.template_id = template_id;
                values.goods_isAdvanceSale = goods_isAdvanceSale;
                values.goods_advance = goods_advance;
                values.goods_advanceSend = goods_advanceSend;
                values.goods_advanceTime = goods_advanceTime;
                values.goods_advanceDay = goods_advanceDay;
                values.goods_isLimit = goods_isLimit;
                values.goods_limitCount = goods_limitCount;
                values.goods_details = goods_details;
                values.goods_isRecommend = goods_isRecommend;
                values.typeList = typeList;
                values.skuList = skuList;
                values.fileList = fileList;
                values.recommendList = recommendList;
                _this.setState({btnLoading:true});
                app.post(goods.ADD_GOODS, values).then((req) => {
                    if (req.code == 1) {
                        app.alert("成功添加", 'success', 1);
                        _this.setState({
                            visible: false,
                            imgUrl: '',
                            finalEditor: '',
                            editorState: EditorState.createEmpty(),
                            btnLoading:false
                        });
                        _this.props.form.resetFields();
                        _this.handleGoBack();
                    } else {
                        app.alert(req.msg, 'error', 2);
                        this.setState({btnLoading:false});
                    }
                })
            }
        })
    }

    /**
     * 页面回跳
     */
    handleGoBack() {
        this.props.history.push(config.path + '/home/goodsManage/')
    }

    /**
     * 获取店铺资质图片
     * @param intelligence
     * @param intelligence1
     */
    handleGetIntelligenceList(pictureList, pictureList1) {
        this.setState({pictureList, pictureList1});
    }

    /**
     * 获取商家选中的分类
     * @param value
     * @param label
     * @param extra
     */
    getShopType = (value, label, extra) => {
        let selectShopType = [];
        let temp = {};
        extra.checkedNodes.forEach((item) => {
            temp = {
                type_id: item.props.type_id,
                type_level: item.props.type_level,
                type_name: item.props.type_name,
                type_parentId: item.props.type_parentId
            };
            selectShopType.push(temp);
        });
        console.log(selectShopType);
        this.setState({
            selectShopType: selectShopType  //复选框全部选中的店铺分类
        })
    };


    /**
     * 获取分类
     */
    requestShopType() {
        let msg = {};
        let temp;
        app.post(type.SEARCH_ALL_TYPE, {}).then(req => {
            if (req.code == 1) {
                let firstMenu = [];
                req.data.map((item) => {
                    // 先查到最顶层数据
                    temp = {
                        label: item.type_name,
                        value: item.type_id,
                        type_id: item.type_id,
                        type_isable: item.type_isable,
                        type_level: item.type_level,
                        type_name: item.type_name,
                        type_parentId: item.type_parentId,
                        key: item.type_id
                    };
                    if (!item.type_parentId) {
                        firstMenu.push(temp);
                    }
                });
                firstMenu.map((item) => {
                    loopType(item, req.data);  //根据最顶层的数据所含的子数据的ID和所有的分类ID比较，相同的则为他的子数据
                });
                this.setState({shopType: firstMenu});
            } else if (req.msg == '查询无记录') {
                app.alert('请先添加分类', 'error', 3);
            } else if (req.code == 2) {
                app.alert(req.msg, 'error', 3)
            }
        });
    }

    /**
     * 显示、隐藏更多信息
     */
    handleShowMore() {
        this.setState({more: !this.state.more});
    }

    /**
     * 显示添加规格值输入框
     * @param index
     */
    handleShowAdd(index) {
        let skuData = this.state.skuData;
        skuData[index].isAdd = true;
        this.setState({skuData});
    }

    /**
     * 回车添加规格值
     * @param e
     * @param index
     */
    handlePressEnter(e, index) {
        let skuData = this.state.skuData;
        let data = {
            id: skuData[index].id + skuData[index].valueData.length + 1,
            value: e.target.value
        };
        const {valueData} = skuData[index];
        if (valueData.length > 1) {
            let isRepeat = false;
            let lastValue = e.target.value;
            for (let i = 0; i < valueData.length; i++) {
                lastValue = lastValue.replace(/\s+/g, '');
                valueData[i].value = valueData[i].value.replace(/\s+/g, '');
                if (valueData[i].value === lastValue) {
                    isRepeat = true;
                    break;
                }
            }
            if (isRepeat) {
                app.alert('属性值不能重复', 'info', 1);
                return;
            }
        }
        skuData[index].valueData.push(data);
        skuData[index].isAdd = false;
        this.setState({skuData});
        this.getData();
    }

    /**
     * 处理规格明细输入事件
     * @param e
     * @param index
     * @param key
     */
    handleInput(e, index, key) {
        let value = e.target.value;
        let indexData = key.toString().split('-');
        let tableList = this.state.tableList;
        let tableList1 = new Array(tableList);
        let temp = tableList1[0];
        this.handleChangeValue(temp, indexData, 0, value, index);
        this.setState({tableList});
    }

    handleChangeValue(data, indexData, index, value, inputIndex) {
        return data.map((item, index1) => {
            let currentIndex = parseInt(indexData[index]);
            if (currentIndex === index1) {
                let valueData = item.valueData;
                if (valueData.length > 0) {
                    item.valueData = this.handleChangeValue(valueData, indexData, index + 1, value, inputIndex);
                } else {
                    item.inputData[inputIndex].value = value;
                }
                return item;
            } else {
                return item;
            }
        });
    }


    /**
     * 上传图片回调
     * @param file
     * @returns {Promise<any>}
     */
    uploadImageCallBack = (file) => {
        return new Promise(
            (resolve, reject) => {
                const xhr = new XMLHttpRequest();
                xhr.open('POST', config.fileUrl + project.UPLOAD);
                const data = new FormData();
                data.append('file', file);
                xhr.send(data);
                xhr.addEventListener('load', () => {
                    const response = JSON.parse(xhr.responseText);
                    let imageUrl = config.imgServerUrl + response.data.imgName;
                    resolve({data: {link: imageUrl}});
                });
                xhr.addEventListener('error', () => {
                    const error = JSON.parse(xhr.responseText);
                    reject(error);
                });
            }
        );
    };

    /**
     * 处理编辑输入事件
     * @param editorState
     */
    onEditorStateChange = editorState => {
        const finalEditor = draftToHtml(convertToRaw(editorState.getCurrentContent()));
        this.setState({
            finalEditor: finalEditor,
            editorState,
        });
    };

    /**
     * 弹框显示添加商品
     * @returns {*}
     */
    handleGetModal = () => {
        return (
            <Row style={{marginTop: '20px'}}>
                <Button type={'primary'} onClick={() => this.handleShowModal(true)}>设置推荐商品</Button>
                <Modal visible={this.state.visible}
                       title={'设置推荐商品'}
                       maskClosable={false}
                       width={'800px'}
                       footer={null}
                       onCancel={() => this.handleShowModal(false)}
                >
                    <Row style={{display: 'flex'}}>
                        <div style={{height: '28px', lineHeight: '28px'}}>
                            分类
                        </div>
                        <TreeSelect
                            treeData={this.state.shopType}
                            treeCheckable={true}
                            multiple={true}
                            onSelect={this.getSearchShopType}
                            showCheckedStrategy={SHOW_PARENT}
                            searchPlaceholder='请选择'
                            style={{width: 180, marginLeft: '20px'}}
                        />
                        <div style={{height: '28px', lineHeight: '28px', marginLeft: '20px'}}>
                            商品名
                        </div>
                        <Input
                            style={{width: '140px', marginLeft: '10px'}}
                            placeholder={'请输入商品名'}
                            onPressEnter={(e) => this.handleOnPressGoodsName(e)}
                            onChange={(e) => this.handleGetSearchGoodsName(e)}/>
                        <div style={{height: '28px', lineHeight: '28px', marginLeft: '20px'}}>
                            商品编号
                        </div>
                        <Input
                            style={{width: '140px', marginLeft: '10px'}}
                            onPressEnter={(e) => this.handleOnPressGoodsCode(e)}
                            onChange={(e) => this.handleGetSearchGoodsCode(e)}
                            placeholder={'请输入商品编号'}/>
                        <Button type={'primary'} style={{marginLeft: '20px'}}
                                onClick={() => this.handleClickSearchGoods()}>搜索</Button>
                    </Row>
                    <Row style={{marginTop: '20px'}}>
                        <Table
                            columns={this.columns1}
                            rowKey={(record, index) => index}
                            dataSource={this.state.allGoodsList}
                            loading={this.state.allLoading}
                            pagination={false}
                        />
                    </Row>
                </Modal>
            </Row>
        );
    };

    handleShowModal(visible) {
        if (visible) {
            const param = {page: 1, size: 10};
            this.handleGetGoodsList(param);
            this.setState({typeSearch: '', codeSearch: '', nameSearch: ''})
        }
        this.setState({visible});
    }

    /**
     * 搜索商品列表
     * @param param
     */
    handleGetGoodsList(param) {
        const _this = this;
        this.setState({allLoading: true});
        const {currentGoodsList} = this.state;
        app.post(goods.SEARCH_GOODS_LIST, param).then(res => {
            if (res.code === 1) {
                const data = res.data;
                for (let i = 0; i < data.length; i++) {
                    data[i].state = '2';
                    for (let j = 0; j < currentGoodsList.length; j++) {
                        if (data[i].goods_code === currentGoodsList[j].goods_code) {
                            data[i].state = '1';
                            break;
                        }
                    }
                }
                _this.setState({allGoodsList: data, allLoading: false});
            } else {
                app.alert(res.msg, 'info', 1);
                _this.setState({allGoodsList: [], allLoading: false});
            }
        })
    }

    /**
     * 获取商品名
     * @param e
     */
    handleGetSearchGoodsName(e) {
        this.setState({nameSearch: e.target.value});
    }

    /**
     * 回车搜索商品
     * @param e
     */
    handleOnPressGoodsName(e) {
        let {typeSearch, codeSearch} = this.state;
        const param = {
            page: 1,
            size: 10,
            nameSearch: e.target.value,
            typeSearch,
            codeSearch
        };
        this.handleGetGoodsList(param);
    }


    /**
     * 获取商品编号
     * @param e
     */
    handleGetSearchGoodsCode(e) {
        this.setState({codeSearch: e.target.value});
    }

    /**
     * 回车搜索商品
     * @param e
     */
    handleOnPressGoodsCode(e) {
        let {typeSearch, nameSearch} = this.state;
        const param = {
            page: 1,
            size: 10,
            codeSearch: e.target.value,
            typeSearch,
            nameSearch
        };
        this.handleGetGoodsList(param);
    }

    /**
     * 处理按钮搜索事件
     */
    handleClickSearchGoods() {
        const {typeSearch, codeSearch, nameSearch} = this.state;
        const param = {
            page: 1,
            size: 10,
            typeSearch,
            codeSearch,
            nameSearch
        };
        this.handleGetGoodsList(param);
    }

    /**
     * 取消商品推荐
     * @param goods_code
     */
    handleDeleteGood1(goods_code) {
        let {currentGoodsList} = this.state;
        for (let i = 0; i < currentGoodsList.length; i++) {
            if (currentGoodsList[i].goods_code === goods_code) {
                currentGoodsList.splice(i, 1);
                break;
            }
        }
        this.setState({currentGoodsList});
    }

    /**
     * 取消商品推荐
     * @param goods_code
     */
    handleDeleteGood(goods_code) {
        let {currentGoodsList, allGoodsList} = this.state;
        for (let i = 0; i < currentGoodsList.length; i++) {
            if (currentGoodsList[i].goods_code === goods_code) {
                currentGoodsList.splice(i, 1);
                break;
            }
        }
        for (let i = 0; i < allGoodsList.length; i++) {
            if (allGoodsList[i].goods_code === goods_code) {
                allGoodsList[i].state = '2';
                break;
            }
        }
        this.setState({currentGoodsList, allGoodsList});
    }

    /**
     * 推荐商品
     * @param goods_code
     */
    handleChooseGood(goods_code) {
        let {currentGoodsList, allGoodsList} = this.state;
        for (let i = 0; i < allGoodsList.length; i++) {
            if (allGoodsList[i].goods_code === goods_code) {
                allGoodsList[i].state = '1';
                currentGoodsList.push(allGoodsList[i]);
                break;
            }
        }
        this.setState({currentGoodsList, allGoodsList});
    }

    // 获取搜索选中的分类
    getSearchShopType = (value, label, extra) => {
        let selectShopType = [];
        let temp = {};
        extra.checkedNodes.forEach((item) => {
            temp = {
                type_id: item.props.type_id,
                type_level: item.props.type_level,
                type_name: item.props.type_name,
                type_parentId: item.props.type_parentId
            };
            selectShopType.push(temp);
        });
        console.log(selectShopType);
        let typeSearch = '';
        for (let i = 0; i < selectShopType.length; i++) {
            typeSearch += selectShopType[i].type_id + ',';
        }
        if (typeSearch.length > 0) {
            typeSearch = typeSearch.substr(0, typeSearch.length - 1);
        }
        this.setState({
            typeSearch,
            searchShopType: selectShopType  //复选框全部选中的店铺分类
        });
        let {codeSearch, nameSearch} = this.state;
        const param = {
            page: 1,
            size: 10,
            typeSearch,
            codeSearch,
            nameSearch
        };
        this.handleGetGoodsList(param);
    };


    /**
     * 库存价格类型
     * @param type
     */
    handleChooseStockType(type) {
        this.setState({show: type});
    }

    /**
     * 获取规格值
     */
    handleGetSkuValue() {
        let {tableList, valueData} = this.state;
        //console.log(this.handleDealWithSkuValue(tableList, ''));
        let result = [];
        let nameList = [];
        let valueNameList = [];
        this.handleGetDetailValue(tableList, '', nameList, valueNameList, result);
        return result;
    }


    handleDealWithSkuValue() {
        const {tableList} = this.state;

        const result = [];
        this.subObatainTreeValue(tableList, result, 0);
        result.forEach(item => {
            const parentList = [];
            this.deep(item, parentList);
            item.parentList = parentList;
        });
        return result;
    }

    deep(d, parentList) {
        const {tableList} = this.state;
        if (d.parentId !== 0) {
            const treeArray = {};
            this.conTreeToArray(tableList, treeArray);
            const result = treeArray[d.parentId];
            parentList.push(result);
            this.deep(result, parentList);
        }

    }

    conTreeToArray(list, result) {
        for (let item of list) {
            result[item.id] = item;
            if (Array.isArray(item.valueData) && item.valueData.length > 0) {
                this.conTreeToArray(item.valueData, result);
            }
        }

    }

    // filterTree(list, callback) {
    //     for (let item of list) {
    //         let re = callback(item);
    //         if (re) {
    //             return item;
    //         }
    //         if (Array.isArray(item.valueData) && item.valueData.length > 0) {
    //             this.filterTree(item.valueData, callback);
    //         }
    //     }
    // }


    /**
     * 处理规格值
     */
    subObatainTreeValue(list, result, parentId) {
        list.forEach(item => {
            item.parentId = parentId;
            if (Array.isArray(item.valueData) && item.valueData.length > 0) {
                this.subObatainTreeValue(item.valueData, result, item.id);
            } else {
                result.push(item);
            }
        });
    }


    handleGetDetailValue(list, name, nameList, valueNameList, result) {
        list.forEach((item) => {
            nameList.push(item.name);
            valueNameList.push(item.value);
            if (Array.isArray(item.valueData) && item.valueData.length > 0) {
                this.handleGetDetailValue(item.valueData, item.name, nameList, valueNameList, result)
            } else {
                result.push({
                    goods_sku_property: nameList.join(','),
                    goods_sku_record: valueNameList.join(','),
                    value: item.inputData
                });
                nameList.splice(nameList.length - 1, 1);
                valueNameList.splice(valueNameList.length - 1, 1);
            }
        });
        nameList.splice(nameList.length - 1, 1);
        valueNameList.splice(valueNameList.length - 1, 1);
    }

}

const GoodsAdds = Form.create()(GoodsAdd);

export default GoodsAdds


